/**
 * 自定义 VitePress 变量
 */

:root {
  --vp-c-brand: #357390;
  --vp-c-brand-light: #4085a3;
  --vp-c-brand-lighter: #5096b5;
  --vp-c-brand-dark: #2d6279;
  --vp-c-brand-darker: #245162;

  --vp-c-sponsor: #fd1d7c;

  /* 文字颜色 */
  --vp-c-text-1: #303133;
  --vp-c-text-2: #606266;
  --vp-c-text-3: #909399;

  /* 自定义容器颜色 */
  --vp-custom-block-tip-border: var(--vp-c-brand);
  --vp-custom-block-tip-text: var(--vp-c-brand-darker);
  --vp-custom-block-tip-bg: rgba(53, 115, 144, 0.1);

  /* 代码块背景色 */
  --vp-code-block-bg: #f9fafb;

  /* 代码块按钮颜色 */
  --vp-code-copy-code-bg: rgba(53, 115, 144, 0.05);
  --vp-code-copy-code-hover-bg: rgba(53, 115, 144, 0.1);
  --vp-code-copy-code-active-text: var(--vp-c-brand);
}

/* 暗色模式 */
.dark {
  --vp-c-text-1: #f2f3f5;
  --vp-c-text-2: #e5eaf3;
  --vp-c-text-3: #a3a6ad;

  --vp-code-block-bg: #161618;
}

/* 布局相关变量 */
:root {
  --vp-layout-max-width: 1500px;

  /* 导航栏高度 */
  --vp-nav-height-mobile: 56px;
  --vp-nav-height-desktop: 65px;

  /* 侧边栏宽度 */
  --vp-sidebar-width: 272px;
}

/* 响应式断点 */
@media (min-width: 640px) {
  :root {
    --vp-sidebar-width: 300px;
  }
}

/* 大屏幕适配 */
@media (min-width: 1440px) {
  :root {
    --vp-layout-max-width: 1440px;
  }
}
